<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org" >
<head>
    <th:block th:include="include :: header('新增任务')" />
    <th:block th:include="include :: datetimepicker-css" />
    <th:block th:include="include :: layout-latest-css" />
    <th:block th:include="include :: ztree-css" />
</head>
<body class="white-bg">
    <div class="wrapper wrapper-content animated fadeInRight ibox-content">
        <h3>编辑任务信息</h3>
        <form class="form-horizontal m" id="form-task-add">
            <div class="form-group">    
                <label class="col-sm-3 control-label">任务名称：</label>
                <div class="col-sm-8">
                    <input name="taskName"  id="taskName" class="form-control" type="text">
                </div>
            </div>
            <div class="form-group">    
                <label class="col-sm-3 control-label">(任务时限)开始时间：</label>
                <div class="col-sm-8">
                    <div class="input-group date">
                        <input name="taskStartTime" id="taskStartTime" class="form-control" placeholder="年/月/日" type="text">
                        <span class="input-group-addon"><i class="fa fa-calendar"></i></span>
                    </div>
                </div>
            </div>
            <div class="form-group">    
                <label class="col-sm-3 control-label">(任务时限)结束时间：</label>
                <div class="col-sm-8">
                    <div class="input-group date">
                        <input name="taskEndTime" id="taskEndTime" class="form-control" placeholder="年/月/日" type="text">
                        <span class="input-group-addon"><i class="fa fa-calendar"></i></span>
                    </div>
                </div>
            </div>
            <div class="form-group">    
                <label class="col-sm-3 control-label">填报滞后：</label>
                <div class="col-sm-8">
                    <select name="lagging" id="lagging" class="form-control m-b">
                        <option value="0">无滞后</option>
                        <option value="1">滞后5天</option>
                        <option value="2">滞后10天</option>
                        <option value="3">滞后15天</option>
                    </select>
                </div>
            </div>
            <div class="form-group">    
                <label class="col-sm-3 control-label">任务类型：</label>
                <div class="col-sm-8">
                    <select name="taskType" id="taskType" class="form-control m-b">
                        <option value="1">临时任务</option>
                        <option value="2">月度任务</option>
                        <option value="3">季度任务</option>
                        <option value="4">年度任务</option>
                    </select>
                </div>
            </div>
            <div class="form-group">    
                <label class="col-sm-3 control-label">审核方式：</label>
                <div class="col-sm-8">
                    <select name="auditMethod" id="auditMethod" class="form-control m-b">
                        <option value="0">无需审核</option>
                        <option value="1">填报公司领导审核</option>
                    </select>
                </div>
            </div>

            <div class="form-group">
                <label class="col-sm-3 control-label">任务附件：</label>
                <div class="col-sm-8">
                    <input id="filePath" name="filePath" class="form-control" type="file" multiple>
                </div>
            </div>
            <div class="form-group">
                <label class="col-sm-3 control-label">任务执行人：</label>
                <div class="col-sm-8">
                    <div class="box box-main">
                        <div id="executor">

                        </div>
                        <div class="ui-layout-content">
                            <div id="tree" class="ztree"></div>
                        </div>
                    </div>
                </div>
            </div>
            <div  class="col-lg-12 col-sm-12 col-md-12"><button type="button" class="btn btn-w-m btn-success" onclick="submitHandler()">下一步</button></div>
        </form>

    </div>
    <th:block th:include="include :: footer" />
    <th:block th:include="include :: datetimepicker-js" />
    <th:block th:include="include :: layout-latest-js" />
    <th:block th:include="include :: ztree-js" />
    <script th:inline="javascript">
        var prefix = ctx + "gs/task"
        $("#form-task-add").validate({
            focusCleanup: true
        });
        //任务执行人
        var executor=[]
        var enclosure=[]

        $(function () {
            queryDeptTree()
        });


        function queryDeptTree() {
            var url = ctx + "gs/company/selectExecutor";
            var options = {
                url: url,
                expandLevel: 2,
                onClick:zOnClick
            };
            function zOnClick(event, treeId, treeNode) {
                    var node=0
                    if (executor.length<1) {
                        executor.push(treeNode.id)
                        $("#executor").append("<span style='margin: 0px 5px'>"+treeNode.name+"</span>")
                    }else{
                        for (var i=0;i<executor.length;i++){
                            if (treeNode.id!=executor[i]){
                               node++
                            }
                        }
                        if (node==executor.length){
                            executor.push(treeNode.id)
                            $("#executor").append(treeNode.name)
                        }
                    }
                    console.info(executor)
            }
            $.tree.init(options);
        }

        function submit(){
            alert("111111111111111")
        }

        function submitHandler() {
            if ($('#filePath')[0].files[0] == null) {
                $.modal.alertWarning("请先选择文件路径");
                return false;
            }
            var files=$('#filePath')[0].files
            for (var i=0;i<files.length;i++){
                var formData = new FormData();
                formData.append('file', $('#filePath')[0].files[i]);
                $.ajax({
                    url: ctx + "common/upload/",
                    type: 'post',
                    cache: false,
                    data: formData,
                    processData: false,
                    contentType: false,
                    dataType: "json",
                    success: function(result) {

                        enclosure.push(result.url)
                        var dataList={
                            "taskName":$("#taskName").val(),
                            "taskStartTime":$("#taskStartTime").val(),
                            "taskEndTime":$("#taskEndTime").val(),
                            "lagging":$("#lagging").val(),
                            "taskType":$("#taskType").val(),
                            "auditMethod":$("#auditMethod").val(),
                            "enclosure":enclosure,
                            "executor":executor
                        }
                        console.info(dataList)



                        $.ajax({
                            url: prefix + "/add",
                            type: "post",
                            dataType: "json",
                            contentType: 'application/json',
                            data:JSON.stringify({
                                "gsTask":dataList
                            }),
                            beforeSend: function () {
                                $.modal.loading("正在处理中，请稍后...");
                                $.modal.disable();
                            },
                            success: function (result) {
                                // $.operate.successCallback(result);
                                //销售单
                                    let url = prefix + "/template";
                                $.modal.parentTab("导入报表模板", url);

                            }
                        });
                        // console.info(enclosure)
                        // $.operate.successCallback(result);
                    }
                });

            }



            // if ($.validate.form()) {
            //     $.operate.save(prefix + "/add", $('#form-task-add').serialize());
            // }
        }

        $("input[name='taskStartTime']").datetimepicker({
            format: "yyyy-mm-dd",
            minView: "month",
            autoclose: true
        });

        $("input[name='taskEndTime']").datetimepicker({
            format: "yyyy-mm-dd",
            minView: "month",
            autoclose: true
        });
    </script>
</body>
</html>